<template>
	
	<form @submit="submit" :data-action="`/api/repaire/save?stationId=${param.id}`">
			
			<view class="fixAuto bb ">
				<view class="w100">
					故障开始时间
				</view>
				<view class="father">
					<view class="flex " :class="startTime?'':'rt'">
						<view :class="startTime?'black':'gray'">
							{{startTime?startTime:'请选择'}}
							<input type="text" name="x.startTime|请选择故障开始时间" :value="startTime?startTime+':00':''" style="display: none;">
						</view>
						<view class="sIcon-arrowRight fz14 grey pl10"></view>
					</view>
					<view class="abs op0">
						<datetime-picker fields="minute" @change="changeStartTime">
							<view >故障开始时间</view>
						</datetime-picker>
					</view>
				</view>
			</view>
			
			<view class="fixAuto bb ">
				<view class="w100">
					故障结束时间
				</view>
				<view class="father">
					<view class="flex " :class="endTime?'':'rt'">
						<view :class="endTime?'black':'gray'">
							{{endTime?endTime:'请选择'}}
							<input type="text" name="x.endTime|请选择故障结束时间" :value="endTime?endTime+':00':''" style="display: none;">
						</view>
						<view class="sIcon-arrowRight fz14 grey pl10"></view>
					</view>
					<view class="abs op0">
						<datetime-picker fields="minute" @change="endTime = $event.fmt3 ">
							<view >故障结束时间</view>
						</datetime-picker>
					</view>
				</view>
			</view>
			
			<view class="father" v-if="typeList.length > 0">
				<view class="fixAuto bb">
					<view class="w100">
						故障类型
					</view>
					<view class="item ">
						<view class="flex ">
							<view>{{typeList[type].title}}</view>
							<view class="sIcon-arrowRight pl10 gray"></view>
							<input type="number" name="x.type|故障类型" :value="type+1" style="display: none;"/>
						</view>
					</view>
				</view>
				<picker mode="selector" class="abs op0" :range="typeList" range-key="title" @change="chooseType">
					<view>请选择</view>
				</picker>
			</view>
			
			<view class="fixAuto bb"  :class="{'middle':isIos}">
				<view class="w100">
					故障情况
				</view>
				<view>
					<textarea auto-height="true" name="x.remark|故障情况" maxlength="-1" placeholder="请输入故障情况"/>
				</view>
			</view>
			
			<view class="fixAuto bb"  :class="{'middle':isIos}">
				<view class="w100">
					更换部件情况
				</view>
				<view>
					<textarea auto-height="true" name="x.repairRemark|更换部件情况" maxlength="-1" placeholder="请输入更换部件情况"/>
				</view>
			</view>
			
			<view class="father">
				<view class="fixAuto bb">
					<view class="w100">
						重新验收
					</view>
					<view class="item ">
						<view class="flex ">
							<view>{{checkList[needCheck]}}</view>
							<view class="sIcon-arrowRight pl10 gray"></view>
							<input type="number" name="x.needCheck|重新验收" :value="needCheck" style="display: none;"/>
						</view>
					</view>
				</view>
				<picker mode="selector" class="abs op0" :range="checkList" @change="needCheck=$event.detail.value">
					<view>请选择</view>
				</picker>
			</view>
			
			<view class="father">
				<view class="fixAuto bb">
					<view class="w100">
						重新校准
					</view>
					<view class="item ">
						<view class="flex ">
							<view>{{checkList[needCalibration]}}</view>
							<view class="sIcon-arrowRight pl10 gray"></view>
							<input type="number" name="x.needCalibration|重新校准" :value="needCalibration" style="display: none;"/>
						</view>
					</view>
				</view>
				<picker mode="selector" class="abs op0" :range="checkList" @change="needCalibration=$event.detail.value">
					<view>请选择</view>
				</picker>
			</view>
			
			<view class="father">
				<view class="fixAuto bb">
					<view class="w100">
						重新校验
					</view>
					<view class="item ">
						<view class="flex ">
							<view>{{checkList[needRecheck]}}</view>
							<view class="sIcon-arrowRight pl10 gray"></view>
							<input type="number" name="x.needRecheck|重新校验" :value="needRecheck" style="display: none;"/>
						</view>
					</view>
				</view>
				<picker mode="selector" class="abs op0" :range="checkList" @change="needRecheck=$event.detail.value">
					<view>请选择</view>
				</picker>
			</view>
			
			
			<view class="plr100 pd30">
				<button form-type="submit" class="btn block rds23">
					保存记录
				</button>
			</view>
		</form>

	</layout>
</template>

<script>
	export default {
		data() {
			return {
				param:{id:""} ,
				startTime:"",
				endTime : "" ,
				typeList:[],
				type : 0 ,
				checkList:["不需要","需要"],
				needCheck : 0 ,
				needCalibration : 0 ,
				needRecheck : 0 ,
				isIos : uni.getSystemInfoSync().platform == "ios" 
			}
		},
		onLoad(params) {
			this.param = params ;
			var data = {} ;
			this.kit.get("/api/repaire/typeList",data,res => {
				this.typeList = res.list ;
			});
		},
		methods: {
			
			changeStartTime:function(e){
				this.startTime = e.fmt3 ;
			},
			
			submit:function(e){
				this.form.submit(e , this.success);
			},
			
			success:function(e){
				this.kit.goSuccessBack("保存成功");
			},
			
			chooseType:function(e){
				this.type = this.typeList[e.detail.value].value - 1;
			},
		}
	}
</script>
<style>
	page{
		background-color: #fff;
	}
</style>